<template>
  <div id="app">
    <button @click="show=true" class="btn1">添加</button>
   <reDialog  width='60%' marginTop='20vh' :show.sync='show'>
   <template v-slot:title>
     <h2>温馨提示</h2>
   </template>
   <template>
    <ul>
      <li>1</li>
      <li>1</li>
      <li>1</li>
      <li>1</li>
    </ul>
   </template>
   <template v-slot:foot >
    <button class="btn" @click="show = false">取消</button>
    <button class="btn" @click="show = false">完成</button>
   </template>
   </reDialog>
  </div>
</template>


<script>
export default {
 data(){
  return{
    show:false
  }
 }
}
</script>


<style>
*{
  margin: 0;
  padding: 0;
}
#app.boxy,html{
  width: 100%;
  height: 100%;
}
.btn{
  width: 100px;
  height: 40px;
  background: rgb(17, 137, 216);
}
ul li{
  list-style: none;
}
.btn1{
  width: 100px;
  height: 40px;
}
</style>


